<!DOCTYPE html>
<html>
	<head lang="en">
    <meta charset="UTF-8">
	

        <script>
         


            //径向渐变
            function draw(){
                var c=document.getElementById("myCanvas");
                var cxt= c.getContext("2d");
                var grd=cxt.createRadialGradient(150,150,0,150,150,100);
                grd.addColorStop(0.1,"#ff0000");
                grd.addColorStop(1,"#00ff00");
                cxt.fillStyle=grd;
                cxt.fillRect(0,0,400,300);
            }
        


        </script>
	</head>
	<body onload="draw()">

        <canvas id="myCanvas" width="320" height="320" style="border: 1px solid #dddddd">Yours browser does not support canvas element.</canvas>
		
	</body>
</html>